<!--
 * @Author: zhangweinan
 * @Date: 2022-12-22 15:49:27
 * @LastEditors: zhangweinan
 * @LastEditTime: 2022-12-23 10:53:12
 * @Description: file content
 * @FilePath: \front-end-of-task-center\src\views\roles\common\area_cascader.vue
-->
<template>
  <div>
    <el-cascader
      ref="refHandle"
      @change="changeArea"
      v-model="organId"
      :props="organIdProps"
      :style="{ width: '100%' }"
      placeholder="请选择查询区域"
      clearable
    ></el-cascader>
  </div>
</template>

<script>
import { getOrganChildren } from "@/api/system/organ";
export default {
  props: {
    orgId: {
      type: Array,
      default: [],
    },
    multiple: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {
      organIdProps: {
        checkStrictly: true,
        multiple: this.multiple,
        label: "name",
        value: "id",
        lazy: true,
        lazyLoad(node, resolve) {
          const { level } = node;
          if (level == 0) {
            getOrganChildren(0).then((res) => {
              resolve(res.data);
            });
          } else {
            getOrganChildren(node.value).then((res) => {
              let data = res.data.map((item) => {
                if (item.level > 2) {
                  item.leaf = true;
                }
                return item;
              });
              resolve(data);
            });
          }
        },
      },
    };
  },
  computed: {
    organId: {
      get() {
        return this.orgId; //父组件传给子组件的值
      },
      set(val) {
        // 改变由父组件控制
        this.$emit("getOrginId", val);
      },
    },
  },
  methods: {
    //勾选数据
    changeArea() {
      const panelRefs = this.$refs.refHandle.$refs.panel;
      panelRefs.lazyLoad(panelRefs.getCheckedNodes()[0]);
    },
  },
};
</script>

<style lang="less" scoped></style>
